<div class="container">

  <div class="left">
    <div class="book_choose">

      <div class="dp domestic">
        <div class="dp_ti">
          <span>国内</span>
          <span class="glyphicon glyphicon-chevron-down down"></span>
        </div>
        <ul>
          <% @books.each do |book| %>
              <% if book.book_type == "1" %>
                  <li>
                    <div class="dp_li_lf" data-id="<%= book.id %>">
                      <%= book.book_name %>
                    </div>
                    <div class="dp_li_rt">
                      <span>A</span><span>B</span>
                    </div>
                  </li>
              <% end %>
          <% end %>
        </ul>
      </div>
      <div class="dp abroad">
        <div class="dp_ti">
          <span>国外</span>
          <span class="glyphicon glyphicon-chevron-down down"></span>
        </div>
        <ul>
          <% @books.each do |book| %>
              <% if book.book_type == "2" %>
                  <li>
                    <div class="dp_li_lf" data-id="<%= book.id %>">
                      <%= book.book_name %>
                    </div>
                    <div class="dp_li_rt">
                      <span>A</span><span>B</span>
                    </div>
                  </li>
              <% end %>
          <% end %>
        </ul>
      </div>
      <div class="dp suike">
        <div class="dp_ti">
          <span>随课</span>
          <span class="glyphicon glyphicon-chevron-down down"></span>
        </div>
        <ul>
          <% @books.each do |book| %>
              <% if book.book_type == "3" %>
                  <li>
                    <div class="dp_li_lf" data-id="<%= book.id %>">
                      <%= book.book_name %>
                    </div>
                    <div class="dp_li_rt">
                      <span>A</span><span>B</span>
                    </div>
                  </li>
              <% end %>
          <% end %>
        </ul>
      </div>
      <div class="dp other">
        <div class="dp_ti">
          <span>其他</span>
          <span class="glyphicon glyphicon-chevron-down down"></span>
        </div>
        <ul>
          <% @books.each do |book| %>
              <% if book.book_type == "4" %>
                  <li>
                    <div class="dp_li_lf" data-id="<%= book.id %>">
                      <%= book.book_name %>
                    </div>
                    <div class="dp_li_rt">
                      <span>A</span><span>B</span>
                    </div>
                  </li>
              <% end %>
          <% end %>
        </ul>
      </div>
    </div>
    <div class="book_save">
      <div class="dp">
        <div class="dp_ti">
          <span>合并表单</span>
          <span class="glyphicon glyphicon-chevron-down down"></span>
        </div>
        <ul>
          <% @dictionaries.each do |dictionary| %>
              <li>
                <div class="dp_li_lf" data-id="<%= dictionary.id %>">
                  <%= dictionary.name %>
                </div>
                <div class="dp_li_rt">
                  <!--<span class="btn btn-primary">详情</span>-->
                  <span class="btn btn-primary exist_output">导出</span>
                </div>
              </li>
          <% end %>
        </ul>
      </div>
    </div>
  </div>
  <div class="right">

    <div class="right_top">
      <header>
        <h2>词表归并</h2>
      </header>
      <div class="classify_collection A_zone">
        <h3>A</h3>
        <div class="classify_box">
          <!-- <div class='add_book'>
              <div class='add_book_name'>初中江苏牛津八年级上</div>
              <div class='add_book_remove'>
                  <span class='glyphicon glyphicon-remove'></span>
              </div>
          </div> -->
        </div>
      </div>
      <div class="classify_collection B_zone">
        <h3>B</h3>
        <div class="classify_box">

        </div>
      </div>
    </div>
    <div class="right_bottom">
      <div class="right_bottom_lf">
        Operation&nbsp;:&nbsp;
      </div>
      <div class="right_bottom_rt">
        <div class="operation_select">
          <div class="operation">
            <img src="imgs/union.png" data-type="union">
          </div>
          <div class="operation">
            <img src="imgs/subtract.png" alt="" data-type="subtract">
          </div>
          <div class="operation">
            <img src="imgs/intersect.png" alt="" data-type="intersect">
          </div>
          <div class="operation">
            <img src="imgs/difference.png" alt="" data-type="difference">
          </div>
        </div>
        <div class="voc_logic_must">请确认A栏内不可为空，且选择了融合方式!</div>

      </div>
      <div class="right_bottom_btn_area clearfix">
        <span class="btn confirm" type = "button">confirm</span>
      </div>
    </div>
  </div>
</div>

<div class="mask">
  <div class="confirm_form">
    <div>
      <span class='glyphicon glyphicon-remove form_cancel'></span>
    </div>
    <div>
      <span class="lf">name&nbsp;<span class="must">(必填)</span>:&nbsp;</span>
      <input type="text" id="form_name">
    </div>
    <div class="form_tip">
      <span class="must">请填写合并后词表名称！</span>
    </div>
    <div>
      <span class="lf">description&nbsp;:&nbsp;</span>
      <textarea name="description" id="form_description" rows="4" ></textarea>
    </div>
    <div>
      <span class="lf">logic&nbsp;:&nbsp;</span>
      <img src="" alt="" id="form_logic">
    </div>
    <div class="submit">
      <input class="btn btn-success save" data-output="false" value = "save" type="button"/>
      <input class="btn btn-success save" data-output="true"  value = "save&nbsp;&&nbsp;output" type="button"/>
      <!--<span class="btn btn-success save" data-output="false">save</span>-->
      <!--<span class="btn btn-success save" data-output="true">save&nbsp;&&nbsp;output</span>-->
    </div>
  </div>
</div>
<script src="js/lib/jquery.min.js"></script>
<script src="js/lib/bootstrap.js"></script>
<script src="js/data_process.js"></script>
